import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:kkhousekeep/page/home/convenient/order/order_result_controller.dart';
import '../../../../widget/custom_app_bar.dart';
import '../../../../widget/custom_table.dart';

class OrderResultPage extends StatelessWidget {
  const OrderResultPage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<OrderResultController>(
      init: OrderResultController(),
      builder: (controller) => Scaffold(
        backgroundColor: const Color(0xFFf4f5f6),
        appBar: CustomAppBar("处理结果"),
        body: SafeArea(
          left: false,
          right: false,
          child: Obx(
            () => SingleChildScrollView(
              child: Column(
                children: [
                  Container(
                    margin: EdgeInsets.only(top: 16.h, bottom: 64.h),
                    color: Colors.white,
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        _buildDetail(context, controller),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        CustomTable.buildFormTitle("处理结果"),
                        CustomTable.buildFormContent(
                                controller.result.value)
                            .marginOnly(left: 32.w, right: 32.w, bottom: 30.h),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        CustomTable.buildFormTitle("原因分析"),
                        CustomTable.buildFormContent(
                                controller.cause.value)
                            .marginOnly(left: 32.w, right: 32.w, bottom: 30.h),
                        DecoratedBox(
                          decoration: BoxDecoration(
                              border:
                                  Border.all(color: Colors.red, width: 1.0)),
                        ),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        CustomTable.buildFormTitle("预防措施"),
                        CustomTable.buildFormContent(
                                controller.propose.value)
                            .marginOnly(left: 32.w, right: 32.w, bottom: 30.h),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        CustomTable.buildFormTitle("维修评价"),
                        CustomTable.buildFormContent(
                                controller.appraise.value)
                            .marginOnly(left: 32.w, right: 32.w, bottom: 30.h),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        CustomTable.buildFormTitle("维修照片"),
                        buildDescriptionPicture(),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            CustomTable.buildFormTitle("维修费用")
                                .marginOnly(right: 60.w),
                            Expanded(
                              child: CustomTable.buildFormContent(
                                  controller.cost.toString()),
                            ),
                          ],
                        ),
                        Container(color: const Color(0xFFf4f5f6), height: 2.h),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            CustomTable.buildFormTitle("协助人员")
                                .marginOnly(right: 60.w),
                            Expanded(
                              child: CustomTable.buildFormContent(
                                  controller.assistants.value),
                            ),
                          ],
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildDetail(
      BuildContext buildContext, OrderResultController controller) {
    return CustomTable(
      children: [
        TableRow(
          children: [
            CustomTable.buildFormTitle("故障类型"),
            CustomTable.buildFormContent(controller.fatalType.value)
                .marginOnly(left: 60.w),
          ],
        ),
        TableRow(
          children: [
            CustomTable.buildFormTitle("维修标准"),
            CustomTable.buildFormContent(controller.standard.value)
                .marginOnly(left: 60.w),
          ],
        ),
      ],
    );
  }

  buildDescriptionPicture() {
    OrderResultController controller = Get.find();
    return GridView.builder(
      primary: false,
      scrollDirection: Axis.vertical,
      shrinkWrap: true,
      padding: EdgeInsets.only(top: 12.h, bottom: 40.h),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        mainAxisSpacing: 24.h,
        crossAxisSpacing: 24.w,
      ),
      itemCount: controller.pics.length,
      itemBuilder: (context, index) {
        return buildDescriptionPictureItem(controller.pics[index]);
      },
    ).marginSymmetric(horizontal: 32.w);
  }

  buildDescriptionPictureItem(String imgUrl) {
    OrderResultController controller = Get.find();
    return InkWell(
      child: CachedNetworkImage(
        imageUrl: imgUrl,
        imageBuilder: (context, imageProvider) => Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.all(
              Radius.circular(6.r),
            ),
            image: DecorationImage(
              fit: BoxFit.cover,
              image: imageProvider,
            ),
          ),
        ),
        placeholder: (context, url) => Container(
          color: Colors.grey,
        ),
        errorWidget: (context, url, error) => const Icon(Icons.error),
      ),
      onTap: () {
        if (imgUrl.isNotEmpty) {
          controller.clickImageItem(imgUrl);
        }
      },
    );
  }
}
